<template>
    <div style="width:100%;height:80%" id="yield_volume_con"></div>
</template>

<script>
import {
    home_scan, // 扫码统计
    } from "@/request/api";
import echarts from 'echarts';
export default {
    data () {
        return {
            //
        };
    },
	methods:{
		init(){
			home_scan('').then((res) =>{
				var data = []
				for (let i = 0; i < res.data.length; i++) {
					const element = res.data[i].num;
					data.push(element)
				}
				var maxNum = Math.max(...data)
				var minNum = Math.min(...data)
				this.$nextTick(() => {
					var worldMapContainer = document.getElementById('yield_volume_con');
					var visiteVolume = echarts.init(worldMapContainer);
					const option = {
						color: ['#3398DB'],
						tooltip : {
							trigger: 'axis',
							axisPointer : {            // 坐标轴指示器，坐标轴触发有效
								type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
							}
						},
						grid: {
							left: '3%',
							right: '4%',
							bottom: '12%',
							top: '5%',
							containLabel: true
						},
						xAxis : [
							{
								type : 'category',
								data: ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
								axisTick: {
									alignWithLabel: true
								}
							}
						],
						yAxis : [
							{
								type : 'value',
								min: minNum,
								max: maxNum,
							}
						],
						series : [
							{
								name:'扫码量',
								type:'bar',
								barWidth: '60%',
								data:data
								// data:[10, 14, 7, 22, 19, 29, 20, 9, 20, 14, 6, 29]
							}
						]
					};
					visiteVolume.setOption(option);
				});
			})
		},
	},
	mounted () {
			this.init();
	}
};
</script>
